<template>
  <div class="app-container">

    <el-form ref="member" :rules="rules" :model="member" status-icon label-position="left" label-width="100px" style="width: 800px; margin-left:50px;">
      <el-form-item label="所属企业">
        <el-select v-model="member.companyId" clearable>
          <el-option v-for="item in companyList" :key="item.id" :label="item.name" :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item label="联系电话" prop="telephone">
        <el-input v-model="member.telephone" />
      </el-form-item>

    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleCancel">取消</el-button>
      <el-button type="primary" @click="handleConfirm">确定</el-button>
    </div>

  </div>
</template>

<script>
import { createMember } from '@/api/companyMember'
import { listCompany } from '@/api/company'
import { getToken } from '@/utils/auth'

export default {
  name: 'MemberEdit',
  data() {
    return {
      id: 0,
      member: {
      },
      companyList: [],
      listLoading: false,
      listQuery: {
        page: 1,
        limit: 5,
        id: undefined,
        name: undefined,
        sort: 'add_time',
        order: 'desc'
      },
      rules: {
        telephone: [
          { required: true, message: '电话不能为空', trigger: 'blur' }
        ],
        companyId: [
          { required: true, message: '企业不能为空', trigger: 'blur' }
        ]
      }
    }
  },
  computed: {
    headers() {
      return {
        'X-Litemall-Admin-Token': getToken()
      }
    }
  },
  created() {
    this.init()
  },
  methods: {
    init: function() {
      this.listLoading = true
      listCompany(this.listQuery).then(response => {
        this.companyList = response.data.data.list
        this.listLoading = false
      }).catch(() => {
        this.companyList = []
        this.listLoading = false
      })
    },
    handleCreate() {

    },
    handleCancel() {
      this.$router.push({ path: '/company/member' })
    },
    handleConfirm() {
      this.$refs['member'].validate(valid => {
        if (valid) {
          createMember(this.member).then(response => {
            this.$router.push({ path: '/company/member' })
          })
            .catch(response => {
              this.$notify.error({
                title: '失败',
                message: response.data.errmsg
              })
            })
        }
      })
    }
  }
}
</script>
